<template>
  <el-header>
    <div id="topMenu">
      <div class="t4_top">
        <div class="t4_top_w">
          <div class="t4_l t4_logo" style="display: inline">
            <a href="/"><img src="../assets/images/zwwlog.png" style="width: 200px"> </a>
          </div>
          <!-- 6.14添加 -->
          <div class="t4_l t4_menus" style="display: inline">
            <ul>
              <li :class="getActive(0)">
                <a @click="toPath('/home')">首页</a>
              </li>
              <li :class="getActive(1)">
                <a href="javascript:void(0);">资源数据<i></i></a>
                <ul class="t4_sub_menus">
                  <li class="shl_menu">
                    <a @click="toPath('/dataDirectory')" target="">数据目录</a>
                  </li>
                  <li class="shl_menu">
                    <a @click="toPath('/serviceDirectory')">服务目录</a>
                  </li>
                  <!-- <li class="shl_menu">
                    <a @click="toPath('/theme')">主题领域</a>
                  </li> -->
                </ul>
              </li>

              <li :class="getActive(2)">
                <a href="javascript:void(0);">资源统计<i></i></a>
                <ul class="t4_sub_menus">
                  <li class="shl_menu">
                    <a @click="toPath('/openStatistics')" target="">开放统计</a>
                  </li>
                  <!-- <li class="no_slh_menu">
                    <a target="">全局图谱</a>
                  </li> -->
                  <li class="shl_menu">
                    <a @click="toPath('/hotspotData')" target="">热点数据</a>
                  </li>
                </ul>
              </li>
              <li :class="getActive(3)">
                <a @click="toPath('/interactiveCommunication')">供需需求</a>
              </li>
              <li :class="getActive(4)">
                <a @click="toPath('/newsInformation')">新闻资讯</a>
              </li>
            </ul>
          </div>

          &nbsp;&nbsp;&nbsp;
          <div class="toolDiv" style="display: inline-block; margin-right: 15px; float: right">
            <div class="login_span">
              <div class="login_box" v-if="Object.keys(parrment).length == 0">
                <span class="el-dropdown-link" @click="showLogin()">
                  登录
                </span>
                <!-- <span>｜</span>
                <span @click="showZc()">注册</span> -->
              </div>
              <div class="login_Avatar" v-else>
                <el-dropdown>
                  <div>
                    <img style="width: 24px; height: 24px; border-radius: 50px" src="../assets/images/yh_login.jpg"
                      alt="" />
                    <span style="color: #fff">{{ parrment.nickName }}</span>
                  </div>

                  <el-dropdown-menu slot="dropdown">
                    <el-dropdown-item @click.native="toPath('/personalCenter')">个人中心</el-dropdown-item>
                    <el-dropdown-item @click.native="ChangePassword">修改密码</el-dropdown-item>
                    <el-dropdown-item @click.native="ChangeLogout">退出登录</el-dropdown-item>
                  </el-dropdown-menu>
                </el-dropdown>
<!--                <span style="color: #fff">｜</span>
                <span style="color: #fff" @click="toHelp">帮助</span>-->
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>

    <!-- 登录弹窗 -->
    <el-dialog :close-on-click-modal="false" title="账号登录" center :visible.sync="dialogVisible" width="550px">
      <!-- 用户登录表单内容 -->
      <el-form ref="loginForm" :model="loginForm" :rules="rules" label-width="20px" v-if="showType == 0">
        <el-form-item prop="phone">
          <el-input v-model="loginForm.username" placeholder="请输入用户名" prefix-icon="el-icon-user"></el-input>
        </el-form-item>
        <el-form-item prop="pwd">
          <el-input v-model="loginForm.password" prefix-icon="el-icon-lock" placeholder="请输入密码"
            type="password"></el-input>
        </el-form-item>
        <el-form-item prop="code">
          <el-input v-model="loginForm.code" auto-complete="off" placeholder="验证码" style="width: 65%">
          </el-input>
          <div class="login-code">
<!--            <img :src="codeUrl" @click="getCodeFn" />-->
            <el-button type="primary" :disabled="countdown > 0" plain @click="dxBtn()">
                            {{ countdown > 0 ? `${countdown}s后重新获取` : '获取验证码' }}
            </el-button>
          </div>
        </el-form-item>
        <el-form-item>
            <el-button type="primary" @keyup.enter.native.prevent="login" @click="login" :loading="loadlogining"
                       style="width: 100%; margin-bottom: 30px">用户登录</el-button>
        </el-form-item>
      </el-form>
<!--      手机号登录表单-->
<!--      <el-form ref="loginForm" :model="loginsjhForm" :rules="rules" label-width="20px"  v-if="showType == 1">-->
<!--        <el-form-item prop="phone">-->
<!--          <el-input v-model="loginsjhForm.mobile" placeholder="请输入手机号" prefix-icon="el-icon-user"></el-input>-->
<!--        </el-form-item>-->
<!--        <el-form-item prop="code">-->
<!--          <el-input v-model="loginsjhForm.code" auto-complete="off" placeholder="验证码" style="width: 65%">-->
<!--          </el-input>-->
<!--          <div class="login-code">-->
<!--            <el-button type="primary" :disabled="countdown > 0" plain @click="dxBtn()">-->
<!--              {{ countdown > 0 ? `${countdown}s后重新获取` : '获取验证码' }}-->
<!--            </el-button>-->
<!--          </div>-->
<!--        </el-form-item>-->
<!--        <el-form-item>-->
<!--          <span style="font-size: 12px;color: #47a5f9;cursor: pointer;margin-left: 10px" @click="goyhm()">用户名登录</span>-->
<!--        </el-form-item>-->
<!--        <el-form-item>-->
<!--          <el-button type="primary" @keyup.enter.native.prevent="loginsjhBtn" @click="loginsjhBtn" :loading="loadlogining"-->
<!--                     style="width: 100%; margin-bottom: 30px">手机验证码登录</el-button>-->
<!--        </el-form-item>-->
<!--      </el-form>-->



    </el-dialog>

    <!-- 修改密码弹窗 -->
    <el-dialog title="修改密码" center width="550px" :visible.sync="dialogVisibleXg" :close-on-click-modal="false">
      <!--修改密码表单内容 -->
      <el-form ref="loginFormXg" :model="loginFormXg" :rules="rulesXg" label-width="100px">
        <el-form-item label="旧密码" prop="oldPassword">
          <el-input v-model="loginFormXg.oldPassword" placeholder="请输入旧密码" style="width: 90%"></el-input>
        </el-form-item>
        <el-form-item label="新密码" prop="password">
          <el-input v-model="loginFormXg.password" placeholder="请输入新密码" type="password" style="width: 90%"></el-input>
        </el-form-item>
        <el-form-item label="确认密码" prop="repeatPassword">
          <el-input v-model="loginFormXg.repeatPassword" placeholder="请输入确认密码" type="password" style="width: 90%"></el-input>
        </el-form-item>
        <!-- <el-form-item prop="verifycode">
          <el-input v-model="loginFormXg.verifycode" auto-complete="off" placeholder="验证码" style="width: 65%">
          </el-input>
          <div class="login-code">
            <img :src="`/api-cloud-platform/login/getVerfyCode?timer=${timestamp}`" @click="getCode" />
          </div>
        </el-form-item> -->
      </el-form>

      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="preserve" style="width: 450px; margin-bottom: 30px">保存</el-button>
      </div>
    </el-dialog>

    <!-- 注册弹窗 -->
    <el-dialog title="注册" center :visible.sync="dialogVisibleZc" width="550px">
      <el-form ref="loginFormZc" :model="loginFormZc" :rules="rulesZc" label-width="80px">
        <el-form-item prop="name" label="用户名称">
          <el-input v-model="loginFormZc.name" placeholder="请输入用户名称"></el-input>
        </el-form-item>
        <el-form-item prop="userName" label="账号名称">
          <el-input v-model="loginFormZc.userName" placeholder="请输入账号名称"></el-input>
        </el-form-item>
        <el-form-item prop="password" label="密码">
          <el-input v-model="loginFormZc.password" placeholder="请输入密码" type="password"></el-input>
        </el-form-item>
        <el-form-item prop="repeatPassword" label="确认密码">
          <el-input v-model="loginFormZc.repeatPassword" placeholder="请输入确认密码" type="password"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="register" style="width: 450px; margin-bottom: 30px">注册</el-button>
      </div>
    </el-dialog>
  </el-header>
</template>

<script>
import { encrypt } from "@/utils/rsaEncrypt";
import Cookies from "js-cookie";
import CryptoJS from "crypto-js";
import {
  getLogin,
  getChangePassword,
  getLogout,
  getPcLogin,
  getRegister,
  getLogo,
  getCode,
  getLoginpc,
  getLoginout,
  getDxyzm
} from "@/utils/httpUtils";
import { set } from "vue";
export default {
  name: "top",
  data() {
    // 密码 确认密码不一致提示
    var validatePass2 = (rule, value, callback) => {
      if (value === "") {
        callback(new Error("请再次输入密码"));
      } else if (value !== this.loginFormXg.password) {
        callback(new Error("两次输入密码不一致!"));
      } else {
        callback();
      }
    };
    var validatePass3 = (rule, value, callback) => {
      if (value === "") {
        callback(new Error("请再次输入密码"));
      } else if (value !== this.loginFormZc.password) {
        callback(new Error("两次输入密码不一致!"));
      } else {
        callback();
      }
    };
    return {
      countdown: 0, // 倒计时初始值为0，表示未开始倒计时
      showType:0,
      tokens: Cookies.get("token") ? JSON.parse(Cookies.get("token")) : '',
      loadlogining: false,
      codeUrl: "",
      fullImageUrl: '',
      AESKey: "978364isyud7tu2g",
      dialogVisible: false,
      dialogVisibleXg: false,
      dialogVisibleZc: false,
      loginForm: {
        // phone: "",
        // pwd: "",
        code: "",
        uuid: "",
        username: "",
        password: ""
      },
      loginsjhForm:{
        mobile:"",
        code:"",
        uuid:""
      },
      loginFormZc: {
        name: "",
        userName: "",
        password: "",
        repeatPassword: "",
      },
      loginFormXg: {
        oldPassword: "",
        password: "",
        repeatPassword: "",
        verifycode: "",
      },
      // loginFormPc: {
      //   username: "admin",
      //   password: "QD5nuEr2vz3GRpmP7PbLYwZGqW7WpCqGKPctNA7hsdU=",
      // },
      rules: {
        username: [
          { required: true, trigger: "blur", message: "账号不能为空" },
        ],
        cipherCode: [
          { required: true, trigger: "blur", message: "密码不能为空" },
        ],
        verifycode: [
          { required: true, trigger: "change", message: "验证码不能为空" },
        ],
      },
      rulesXg: {
        // 旧密码
        oldPassword: [
          { required: true, trigger: "blur", message: "旧密码不能为空" },
        ],
        //新密码
        password: [
          { required: true, trigger: "blur", message: "新密码不能为空" },
          {
            pattern: /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d|.*[\W_]).{8,}$/,
            message: "密码必须包含大小写字母、数字和特殊字符、不能少于8位",
          },
        ],
        // 确认密码
        repeatPassword: [
          {
            required: true,
            trigger: "change",
            validator: validatePass2,
          },
        ],
        // 验证码
        verifycode: [
          { required: true, trigger: "change", message: "验证码不能为空" },
        ],
      },
      rulesZc: {
        name: [
          { required: true, trigger: "blur", message: "用户名称不能为空" },
        ],
        userName: [
          { required: true, trigger: "blur", message: "账号名称不能为空" },
        ],
        //密码
        password: [
          { required: true, trigger: "blur", message: "新密码不能为空" },
          {
            pattern: /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d|.*[\W_]).{8,}$/,
            message: "密码必须包含大小写字母、数字和特殊字符、不能少于8位",
          },
        ],
        // 确认密码
        repeatPassword: [
          {
            required: true,
            trigger: "change",
            validator: validatePass3,
          },
        ],
      },

      codeUrl: "",
      dsq: null,
      timestamp: new Date().getTime(),
      // parrment: localStorage.getItem("user")
      //   ? JSON.parse(localStorage.getItem("user"))
      //   : {},
      parrment: Cookies.get("user")
        ? JSON.parse(Cookies.get("user"))
        : {},
    };
  },
  watch: {
    $route(to, from) {
      const user = Cookies.get("user");
      if(!user && to.path === '/home') {
        this.$nextTick(()=>{
          this.$router.go(0)
        })
      }
    }
  },
  mounted() {
    // this.LogoFn();
    this.activePath = this.$route.path;
    console.log(window, "window");
    // 检查Cookie是否过期
    const user = Cookies.get("user");
    if (!user) {
      this.dialogVisible = true;
    }
    // this.getCodeFn();
    if (!Cookies.get("token")) {
      this.startinterval()
    }

    window.addEventListener('keyup', this.handleKeyUp);
  },
  beforeDestroy() {
    window.removeEventListener('keyup', this.handleKeyUp);
  },
  methods: {
    startCountdown() {
      this.countdown = 60; // 设置倒计时时间为60秒
      const interval = setInterval(() => {
        if (this.countdown > 0) {
          this.countdown--;
        } else {
          clearInterval(interval); // 倒计时结束，清除定时器
        }
      }, 1000);
    },
    dxBtn(){
      if (!this.loginForm.username) {
        this.$message.error('请输入用户名');
        return;
      }
      if (!this.loginForm.password) {
        this.$message.error('请输入密码');
        return;
      }
      // 开始60秒倒计时
      this.startCountdown();
      getDxyzm({userName:this.loginForm.username,textMessageType:0}).then(res=>{
        this.loginForm.uuid= res.uuid
        // this.$message({
        //   message: res.msg,
        //   type: 'success'
        // });
      }).catch(err=>{
        this.$message({
          showClose: true,
          message: err.response.data.message,
          type: 'error'
        });
      })
    },
    gosjh(){
      this.showType = 1
      this.loginsjhForm.code = ''
      this.loginsjhForm.uuid = ''
      // this.$refs.loginForm.clearValidate(); // 清除所有校验状态
    },
    goyhm(){
      this.showType = 0
      this.loginForm.code = ''
      // this.getCodeFn()
      // this.$refs.loginsjhForm.clearValidate(); // 清除所有校验状态
    },
    startinterval() {
      this.dsq = setInterval(() => {
        // this.getCodeFn()
      }, 100000)
      console.log(this.dsq, 'this.dsq');
    },
    clearCaptchaInterval() {
      console.log(this.dsq, "this.dsq");
      this.dsq = null
    },
    handleKeyUp(event) {
      if (event.key === 'Enter') {
        if (!this.dialogVisible) return; // LZYFIX
        if(this.showType == 0){
          this.login();
        }
        if(this.showType == 1){
          this.loginsjhBtn()
        }
      }
    },
    // 添加 回车事件
    // enterSearch() {
    //   document.onkeydown = (e) => {
    //     // console.log(e.target.baseURI);
    //     //13表示回车键，baseURI是当前页面的地址，为了更严谨，也可以加别的，可以打印e看一下
    //     // match(此处应填写文件在浏览器中的地址，如 '/login')，不写的话，其他页面也会有调用回车按下的方法
    //     if (e.keyCode === 13 && e.target.baseURI.match(/home/)) {
    //       //回车后执行搜索方法
    //       this.login();
    //     }
    //   };
    // },
    // getCodeFn() {
    //   getCode().then((res) => {
    //     console.log(res, "验证码")
    //     this.codeUrl = res.img;
    //     this.loginForm.uuid = res.uuid;
    //   });
    // },
    // LogoFn() {
    //   getLogo({
    //     type: 1,
    //     systemCode: "api-back",
    //   }).then((res) => {
    //     console.log(res.data.fileUrl, "logo");
    //     // const url = "http://172.20.1.3:88/portal-web/";
    //     const url = "http://10.217.220.27:88/portal-web/";
    //     this.fullImageUrl = url + res.data.fileUrl;
    //   });
    // },
    // 点击注册
    register() {
      let data = `name=${this.loginFormZc.name}
      &userName=${this.loginFormZc.userName}
      &password=${this.encrypt(this.loginFormZc.password)}
      &repeatPassword=${this.encrypt(this.loginFormZc.repeatPassword)}`;
      getRegister(data).then((res) => {
        console.log(res, "注册接口");
        if (res.code == "000000") {
          this.$message({
            message: "注册成功，请联系管理员审批",
            type: "success",
          });
          this.dialogVisibleZc = false;
        } else {
          this.$message.error("注册失败");
        }
      });
    },
    showZc() {
      this.dialogVisibleZc = true;
    },
    toPath(path) {
      this.activePath = path;
      this.$forceUpdate();
      this.$router.push({ path: path });
    },
    showLogin() {
      this.dialogVisible = true;
      this.getCode();
    },
    encryptPassword() { },
    loginsjhBtn(){
      if (!this.loginsjhForm.mobile) {
        this.$message.error('请输入手机号');
        return;
      }
      if (!this.loginsjhForm.code) {
        this.$message.error('请输入验证码');
        return;
      }
      // 设置加载状态为true
      this.loadlogining = true;
      let obj = {
        phone: this.loginsjhForm.mobile,
        uuid: this.loginsjhForm.uuid,
        code: this.loginsjhForm.code,
        loginType:1
      };
      getLoginpc(obj).then((res) => {
        console.log(res, "登录成功")
        localStorage.setItem('token', JSON.stringify(res.token))
        Cookies.set("user", JSON.stringify(res.user.user), { expires: 7 });
        Cookies.set("token", JSON.stringify(res.token), { expires: 7 });
        this.dialogVisible = false;
        this.clearCaptchaInterval(); // 在组件销毁前清除定时器
        setTimeout(() => {
          this.$router.go(0);

        }, 300)
        this.$message({
          message: '登录成功',
          type: 'success',
        });
      }).catch(err => {
        console.log(err, "err")
        this.$message({
          showClose: true,
          message: err.response.data.message,
          type: 'error'
        });
      })
        .finally(() => {
          // 请求结束后，无论成功还是失败，加载状态设为false
          this.loadlogining = false;
        });
    },
    // 登录按钮
    login() {
      if (!this.loginForm.username) {
        this.$message.error('请输入用户名');
        return;
      }
      if (!this.loginForm.password) {
        this.$message.error('请输入密码');
        return;
      }
      if (!this.loginForm.code) {
        this.$message.error('请输入验证码');
        return;
      }
      // 设置加载状态为true
      this.loadlogining = true;
      let obj = {
        username: this.loginForm.username,
        password: encrypt(this.loginForm.password),
        uuid: this.loginForm.uuid,
        code: this.loginForm.code,
        loginType:0
      };
      getLoginpc(obj).then((res) => {
        console.log(res, "登录成功")
        localStorage.setItem('token', JSON.stringify(res.token))
        Cookies.set("user", JSON.stringify(res.user.user), { expires: 7 });
        Cookies.set("token", JSON.stringify(res.token), { expires: 7 });
        this.dialogVisible = false;
        this.clearCaptchaInterval(); // 在组件销毁前清除定时器
        setTimeout(() => {
          this.$router.go(0);

        }, 300)
        this.$message({
          message: '登录成功',
          type: 'success',
        });
      }).catch(err => {
        console.log(err, "err")
        // this.getCodeFn()
        this.$message({
          showClose: true,
          message: err.response.data.message,
          type: 'error'
        });
      })
        .finally(() => {
          // 请求结束后，无论成功还是失败，加载状态设为false
          this.loadlogining = false;
        });
      // let md5Data = this.encrypt(this.loginForm.cipherCode);
      // console.log(md5Data);
      // this.$refs.loginForm.validate((valid) => {
      //   if (valid) {
      //     let data = `username=${
      //       this.loginForm.username
      //     }&cipherCode=${this.encrypt(this.loginForm.cipherCode)}&verifycode=${
      //       this.loginForm.verifycode
      //     }`;
      //     console.log(data, "data");
      //     getLogin(data).then((res) => {
      //       if (res.code == "000000") {
      //         console.log(res, "登录");
      //         this.$message({
      //           message: "登录成功",
      //           type: "success",
      //           duration: 1000,
      //         });
      //         this.dialogVisible = false;
      //         // Cookies存储登录成功后的用户信息
      //         Cookies.set("userInfo", JSON.stringify(res.data), { expires: 7 });
      //         // 更新登录信息
      //         this.parrment = res.data;
      //
      //         // // 调后台接口
      //         let dataPc = `username=${window.loginFormPc.username}&password=${window.loginFormPc.password}`;
      //         getPcLogin(dataPc).then((res) => {
      //           // Cookies.set("apiUserToken", JSON.stringify(res.data.apiUserToken));
      //           // 刷新页面
      //           // location.reload();
      //         });
      //       } else {
      //         this.$message({
      //           message: res.msg,
      //           type: "error",
      //         });
      //         this.getCode();
      //       }
      //     });
      //   }
      // });
    },
    // 加密
    encrypt(pwd) {
      const key = CryptoJS.enc.Utf8.parse(this.AESKey);
      const srcs = CryptoJS.enc.Utf8.parse(pwd);
      const encrypted = CryptoJS.AES.encrypt(srcs, key, {
        mode: CryptoJS.mode.ECB,
        padding: CryptoJS.pad.Pkcs7,
      });
      return encrypted.toString();
    },
    getCode() {
      this.timestamp = new Date().getTime();
    },

    // 修改密码保存
    preserve() {



      this.$refs.loginFormXg.validate((valid) => {
        if (valid) {
          let params = {
            oldPass: encrypt(this.loginFormXg.oldPassword),
            newPass: encrypt(this.loginFormXg.password),
          }
          this.$axios({
            url: xhDomain + `/api/users/updatePass`,
            method: 'post',
            headers: {
              'Content-Type': 'application/json',
              "Authorization": this.tokens

            },
            data: params
          }).then((res) => {
            console.log(res);
            this.dialogVisibleXg = false
            // if (res.data.code === 400) {
            //   this.$message({
            //     showClose: true,
            //     message: res.data.msg,
            //     type: 'error'
            //   });
            //   this.loginFormXg.password = ""
            //   this.loginFormXg.oldPassword = ""
            //   this.loginFormXg.repeatPassword = ""
            // }
            if (res.status === 200) {
              this.$message({
                message: '修改成功',
                type: 'success'
              });
              this.loginFormXg.password = ""
              this.loginFormXg.oldPassword = ""
              this.loginFormXg.repeatPassword = ""
              // 退出登录
              // this.$axios({
              //     url: xhDomain + `/auth/logout`,
              //     method: 'post',
              //     headers: { 'Content-Type': 'application/json' },
              //     // data: params
              // }).then((res) => {
              //     console.log(res);
              //     localStorage.removeItem('token')
              //     this.$router.push({ path: '/login' })
              // }).catch((err) => {
              //     this.$router.push({ path: '/login' })

              // })
            }

          }).catch((error) => {
            console.log(error);
            this.dialogVisibleXg = false
            this.$message({
                message: error.response.data.message,
                type: 'error'
              });
              this.loginFormXg.password = ""
              this.loginFormXg.oldPassword = ""
              this.loginFormXg.repeatPassword = ""
          })
        } else {
          console.log('error submit!!');
          return false;
        }
      });
      // getChangePassword(){}
    },
    ChangePassword() {
      this.dialogVisibleXg = true;
      this.loginFormXg = {
        oldPassword: "",
        password: "",
        repeatPassword: "",
        verifycode: "",
      };
      this.getCode();
    },
    // 退出登录
    ChangeLogout() {
      this.$router.push('/logout')
      setTimeout(() => {
        getLoginout({
        }).then((res) => {
          this.$message({
            message: "退出成功",
            type: "success",
            duration: 1000,
          });
          Cookies.remove("user");
          Cookies.remove("token");
          localStorage.removeItem('token')
          this.$router.push("/home");
          this.parrment = {};
          // window.location.reload();
        }).catch(err => {
          this.$message({
            message: "退出成功",
            type: "success",
            duration: 1000,
          });
          Cookies.remove("user");
          Cookies.remove("token");
          localStorage.removeItem('token')
          this.$router.push("/home");
          this.parrment = {};
        });
      }, 300)

    },
    toHelp() {
      // window.open("http://172.20.1.3:86/books/opencatalog/", "_blank");
      window.open("http://10.217.220.27:88/books/openservice/", "_blank");
    },
    getActive(type) {
      return [
        ["/home"],
        ["/dataDirectory", "/serviceDirectory", "/theme"],
        ["/openStatistics", "/hotspotData"],
        ["/interactiveCommunication"],
        ["/newsInformation"]
      ][type].includes(this.activePath)
        ? "current t4_hover"
        : "";
    },
  },
};
</script>

<style scoped>
.login_span {
  display: flex;
  color: #fff;
  cursor: pointer;
}

.login_span .login_box {
  display: flex;
}

.el-header {
  height: 75px !important;
  padding: 0;
}

.t4_top {
  background-color: #145085;
  line-height: 72px;
  height: 75px;
}

.t4_top .t4_top_w {
  width: 1195px;
  width: calc(100% - 220px) !important;
  /* LZYFIX */
  margin: 0 auto;
}

.t4_top .t4_top_w .t4_l {
  float: left;
}

.t4_top .t4_top_w .t4_menus {
  padding: 0;
  /* padding-left: 10px; */
  margin: 0;
}

.t4_top .t4_top_w .t4_menus li a {
  cursor: pointer;
}

.toolDiv a:nth-child(1) {
  color: #fff;
  background-color: #47a5f9;
  padding: 4px 7px;
  border-radius: 5px;
}

.toolDiv a:nth-child(2) {
  color: #fff;
  background-color: #dd0900;
  padding: 4px 7px;
  border-radius: 5px;
}

.login-code {
  float: right;
}

ol,
ul {
  padding-left: 0;
}
</style>
